<template >
  <div class="theSingleChoiceCard" :style="changeColorAndBorder">
    <div class="quesBox">


      <div class="quesTitle" >
        <span v-show="item.optional" class="quesStar">* </span>
        <span v-show="autoId">{{num+1}}.</span><span>{{Nametitle}}</span>
      </div>
    
      <div >
        <div class="coverOnQues">
        <el-input
            type="textarea"
            :autosize="{ minRows: 1}"
            placeholder=""
      >
        </el-input>
        </div>
      </div>

    </div>
  </div>
</template>

<script>

export default {
  name:'ESingleTiankong',
  data(){
    return{
        Nametitle:姓名
    }
  },
  watch:{
    tt(){
      this.$forceUpdate();
    }
  },
  props:{
    ifIsEditing:Boolean,  //是否正在编辑
    item:Object, //本题
    autoId:Boolean, //是否显示题号
    num:Number, //显示的题号（从0开始）
    tt:Number,
  },
  computed:{
    changeColorAndBorder:function (){
      if(this.ifIsEditing)
        return "background-color: #e7edfc; border: 2px dashed #b4c4ec";
      else return "";
    }
  }
}

</script>

<style scoped>
.theSingleChoiceCard{
  text-align: left;
  user-select:none;
  background-color: white;
  width: 99.4%;
}
.quesBox{
  padding:10px 40px 10px 40px;
}
.quesTitle{
  margin-bottom: 10px;
  text-align: left;
  font-size:17px;
  line-height: 1.3;
  display: block;
}
.quesRemark{
  margin-bottom: 20px;
  text-align: left;
  font-size:14px;
  line-height: 1.3;
  color:grey;
  display: block;
}
.quesStar{
  color:red;
  font-size: 20px;
  float:left;
}
.quesOptionGroup{
  padding: 0;
  margin: 0 0 10px 0;
  display: block;
}
.quesAnOption{
  margin:0 0 5px 0;
  display: block;
}
.coverOnQues{
  z-index: 2;
  height: 100%;
  width: 100%;
  cursor: default;
}
</style>